<template>
  <div class="commoditytables">
    <div class="tablestitle">
      <div>商品汇总</div>
    </div>
    <div class="tablescontent">
      <template>
        <el-table :data="tableData" height="500" border style="width: 100% ;" max-height="500" >
          <el-table-column prop="date" fixed  label="商品">
          </el-table-column>
          <el-table-column prop="name" label="单位">
          </el-table-column>
          <el-table-column prop="address" label="收货数量">
          </el-table-column>
          <el-table-column prop="address" label="收货金额">
          </el-table-column>
          <el-table-column prop="address" label="退货数量">
          </el-table-column>
          <el-table-column prop="address" label="退货金额">
          </el-table-column>
          <el-table-column prop="address" label="实际金额">
          </el-table-column>
        </el-table>
      </template>
    </div>
  </div>
</template>

<script>
</script>

<style>
  .commoditytables {
    /* background-color: #bfa; */

  }
  .commoditytables .tablestitle {
    margin-bottom: 10px;
  }
  .commoditytables .tablestitle div {
    font-weight: 700;
    padding-left: 15px;
    font-size: 14px;
    line-height: 25px;
    color: #303030;
    border-left: 4px solid #1890ff;
  }
  .commoditytables .tablescontent{
    border-top: 1px solid rgb(221, 221, 221) ;
    padding-top: 10px;
  }
</style>
